$(function () {
    //默认显示专家
    $('#buttonExpert').addClass('searchContentButton_active');
    $('#buttonIllness').removeClass('searchContentButton_active');

    $(".searchIllness").css("display","none")
    $(".searchExpert").css("display","block")


    //搜索的文本框获取焦点时,隐藏菜单内容和顶部
    $("#popupText").focus(function () {
        document.getElementById('popupText').style.width='5.3rem';
        document.getElementById('searchTip').style.display='block';
        document.getElementById('searchNull').style.display='none';
        if(this.value===''||this.value===null){
            document.getElementById('popupCancelButton').style.display='block';
            document.getElementById('popupSearchButton').style.display="none";
            $("#searchContent").css("display","none")
        }
    })

    $('#popupText').keyup(function () {
        let textValue=this.value;
        if(textValue===''||textValue===null){
            //为空则切换为取消按钮
            document.getElementById('popupCancelButton').style.display='block';
            document.getElementById('popupSearchButton').style.display="none";
        }else{
            //不为空切换为搜索按钮
            document.getElementById('popupCancelButton').style.display='none';
            document.getElementById('popupSearchButton').style.display="block";
        }
    })
    //文本框的按键事件
    $("#popupText").on('keypress', function(e) {    //#keyword为input文本框
        let keycode = e.keyCode;
        //按键值为13时即为换行符，则触发搜索
        if (keycode === 13) {
            //显示取消按钮
            document.getElementById('popupCancelButton').style.display = 'block';
            document.getElementById('popupSearchButton').style.display = "none";
            //假装搜索到值
            if (document.getElementById('popupText').value == 1) {
                //隐藏提示
                document.getElementById('searchTip').style.display = 'none';
                //显示搜索到的内容div
                document.getElementById('searchContent').style.display = 'block';
                //默认显示病症上不按钮
                $('#buttonIllness').addClass('searchContentButton_active');
                $('#buttonExpert').removeClass('searchContentButton_active');
                //隐藏空页面
                document.getElementById('searchNull').style.display = 'none';
                //显示病症
                $(".searchIllness").css('display', 'block')
                // 隐藏专家
                $(".searchExpert").css('display', 'none')
            } else {
                // 隐藏提示
                document.getElementById('searchTip').style.display = 'none';
                //显示空页面
                document.getElementById('searchNull').style.display = 'block';
            }
            //清空文本框内容
            document.getElementById('popupText').value = '';
        }
    });

    //点击搜索按钮后
    $('#popupSearchButton').click(function () {
        document.getElementById('popupCancelButton').style.display='block';
        document.getElementById('popupSearchButton').style.display="none";
        if(document.getElementById('popupText').value==1){
            document.getElementById('searchTip').style.display='none';
            document.getElementById('searchContent').style.display='block';
            $('#buttonIllness').addClass('searchContentButton_active');
            $('#buttonExpert').removeClass('searchContentButton_active');
            document.getElementById('searchNull').style.display='none';
            $(".searchIllness").css('display','block')
            $(".searchExpert").css('display','none')
        }else{
            $("#searchContent").css("display","none")
            document.getElementById('searchTip').style.display='none';
            document.getElementById('searchNull').style.display='block';
        }
        document.getElementById('popupText').value='';
    })
    //搜索结果中，结果为专家的按钮
    $('#buttonExpert').click(function () {
        //点击专家，隐藏病症
        $('#buttonExpert').addClass('searchContentButton_active');
        $('#buttonIllness').removeClass('searchContentButton_active');

        $(".searchIllness").css("display","none")
        $(".searchExpert").css("display","block")

    })
    //搜索结果中，结果为病症的按钮
    $('#buttonIllness').click(function () {
        //点击病症，隐藏专家
        $('#buttonIllness').addClass('searchContentButton_active');
        $('#buttonExpert').removeClass('searchContentButton_active');

        $(".searchIllness").css("display","block")
        $(".searchExpert").css("display","none")
    })
})
